<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>DAMA考试题</title>
	<script src="dama.js"></script>
	<style>
		p {margin: 0; padding: 5px;}
		.yes {
			color: #FFF;
			background-color: rgb(51.2, 126.4, 204);
		}
	</style>
</head>
<body>
	<div id="damas" style="padding: 1px 2px;">
	</div>
	
	<script>
		var getWTHTML = function(dama, sno) {
			return '<div>' + sno + '、'+ dama.wt + '</div>';
		};
		var getXXHTML = function(dama, sno) {
			var xxArray = [];
			xxArray.push('<div id="xx_'+sno+'">');
			for(var x = 0, xLne = dama.xx.length; x < xLne; x++) {
				xxArray.push('<p onclick="selectItemAction('+sno+')">'+dama.xx[x]+'</p>');
			}
			xxArray.push('</div>');
			return xxArray.join('');
		};
		var selectItemAction = function(sno) {
			var items = damas[sno-1].xx;
			var itemArray = [];
			for(var y = 0; y < items.length; y++) {
				if(damas[sno-1].da === items[y]) {
					itemArray.push('<p class="yes">'+items[y]+'</p>');
				} else {
					itemArray.push('<p>'+items[y]+'</p>');
				}
			}
			document.getElementById('xx_' + sno).innerHTML = itemArray.join('');
		};
		
		var allHTML = [];
		
		for(var i = 0, iLen = damas.length; i < iLen; i++) {
			allHTML.push('<div>');
			allHTML.push(getWTHTML(damas[i], i+1));
			allHTML.push(getXXHTML(damas[i], i+1));
			allHTML.push('</div>');
		}
		
		document.getElementById('damas').innerHTML = allHTML.join('');
	</script>
</body>
</html>
